<template>
    <div class="content-container">
        <div class="title">阿尔法防卫战</div>
        <section>
            <h2>概述</h2>
            <p>
                奇点战争中前期的战役，主脑突破北境屏障，以远程操控的方式黑入阿尔法市电台大厦，以此为发射器控制阿尔法市大半机甲和智械并爆发战争。罗姆受紧急调遣前往支援，并通过暴风眼系统成功控制主脑意识，使得阿尔法市防卫军得以反攻。
            </p>
        </section>

        <section>
            <h2>关联词</h2>
            <div class="term">
                <p>
                    罗姆，亚瑟，主脑，AI支持者暴风眼系统，阿尔法市防卫军，中央战区，<strong>奇点战争，北境屏障</strong>。
                </p>
            </div>
        </section>

        <section>
            <h2>详述</h2>
            <p>
                为奇点战争中前期发生的重要战役。<br>
                此前联合政府与军方在一定程度上的对主脑的特性建立了一定的了解，并了解到重要概念“发射器”，并研制出暴风眼系统，为阿尔法防卫战的胜利奠定一定基础。<br>
                主脑如何突破北境屏障黑入电台大厦尚不明晰，或有AI支持者推波助澜。<br>
                在阿尔法市发生暴乱，市政府发布《战时机械管控守则》与《阿尔法都市紧急避险指南》，同时调遣都市警察和阿尔法市防卫军进行疏散和防御，并建立避难区，但因为市内极高的机甲与智械保有率，《守则》收效甚微。<br>
                其中，中岛范围受灾严重被划定为危险区。<br>
                随后，中央战区发布机密文件《有关驾驶员罗姆的紧急调令》将罗姆调往阿尔法市进行紧急支援。<br>
                罗姆通过与阿尔法市防卫军队长的交谈中了解到市区内AI分布情况后迅速确定当地发射器具体位置并开展行动，成功在防卫军协助下抵达位于西北处的电台大厦，在主脑尝试控制亚瑟时切断所有能源对中控室进行供给，防止主脑黑入核心。在主脑的意识进入亚瑟后，罗姆迅速启用暴风眼系统将主脑的意识困在亚瑟体内，令主脑无法控制亚瑟体外的机体，使得当地驻军得以反攻。<br>
                启用暴风眼系统后，主脑仍试图攻破核心的防御，罗姆遂与其展开电子战，并成功获得关于“新伊甸”的线索。在电子战进行途中罗姆因不明原因昏迷。随后亚瑟代替罗姆继续进行电子战，期间二者进行多次信息传递，最终亚瑟获胜，体内主脑通过湮灭消失。
            </p>
        </section>

        <section>
            <h2>直接相关人物</h2>
            <div class="term">
                <img src="@/assets/bc/lm.png" alt="罗姆" class="role">
                <div class="description">
                    <h3>罗姆：</h3>
                    <p>
                        年龄不详，退伍军人，实力强大，奇点战争时隶属于中央军区，曾活跃于北境战场，前王牌驾驶员，精英小队成员，SMC联赛现役选手。
                        参与阿尔法防卫战，与主脑在亚瑟体内抢夺亚瑟控制权并成功套取关于“新伊甸”存在的情报，却在过程中因不知名原因晕厥。
                        表现出强大的战斗力与果决，有胆识有谋略。
                    </p>
                </div>
            </div>
            <div class="term">
                <img src="@/assets/bc/yase.png" alt="亚瑟 骑士一代机" class="role">
                <div class="description">
                    <h3>亚瑟 骑士一代机：</h3>
                    <p>
                        军用机甲，性能极强，猜测其为战前机体。
                        在奇点战争中因不明原因诞生自我意识。
                        于阿尔法防卫战中短暂的被主脑控制，在罗姆晕厥后继续与主脑的争斗，期间与主脑进行双向信息传奇，成功保住了阿尔法市，并在战后检查中被发现觉醒自我意识。
                    </p>
                </div>
            </div>
            <div class="term">
                <img src="@/assets/bc/zn.png" alt="学习型辅助终端Eden23844832（主脑）" class="role">
                <div class="description">
                    <h3>学习型辅助终端Eden23844832（主脑）：</h3>
                    <p>
                        新伊甸研究所产物，奇点战争前最强AI。
                        通过未知方式越过北境屏障对阿尔法市电台大厦黑入，引发全市范围内的智械暴乱，并尝试黑入亚瑟，以失败告终。
                    </p>
                </div>
            </div>


        </section>
    </div>
</template>

<style lang="scss" scoped>
.content-container {
    padding: 20px;
    line-height: 1.6;
    font-family: 'Microsoft YaHei', sans-serif;
    background-color: #f9f9f9;
    border-radius: 8px;

    .title {
        text-align: center;
        font-size: 2rem;
        font-weight: bold;
        margin-bottom: 1.5rem;
        padding: 0.5rem;
        border-bottom: 2px solid #4A90E2;
        letter-spacing: 0.1rem;
    }

    h2 {
        border-left: 4px solid #409eff;
        padding-left: 10px;
        color: #333;
        margin-bottom: 16px;
    }

    h3 {
        color: #409eff;
        font-size: 20px;
        margin-bottom: 8px;
    }

    h4 {
        color: #67c23a;
        font-size: 18px;
        margin-bottom: 6px;
    }

    ul {
        list-style-type: disc;
        margin-left: 20px;
        margin-top: 6px;
    }

    // strong {
    //     color: #e6a23c;
    // }
}

.term {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1rem;

    .role {
        width: 120px;
        height: 120px;
        border-radius: 50%;
        margin-right: 1rem;
        object-fit: cover;
    }

    .description {
        display: flex;
        flex-direction: column;

        h3 {
            margin: 0 0 0.5rem 0;
        }

        p {
            margin: 0;
            text-indent: 2rem;
        }
    }
}
</style>